.card {
  transition: all .3s;
  &:hover,
  &:focus {
    .card-title {
      box-shadow: inset 0 -1rem 1.5rem $primary-300;
      padding: 0 0.75rem 0 1rem;
      margin-left: -1rem;
    }
  }
  &-title {
    color: $info;
    margin-bottom: 0;
  }
  &-body {
    min-height: 156px;
  }
  &-footer {
    background-color: $light;
    border-top: none;
    text-align: center;
    &:hover,
    &:focus {
      background-color: $primary-300;
    }
  }
  &-overlay {
    height: 78px;
    transition: all .3s ease-in-out;
    &-inner {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      color: #ffffff98;
      background: linear-gradient(90deg, #000000, #00000000 55%, #00000010);
      padding: 1rem 1.5rem;
    }
  }
}